<template>
    <div class="app-container">
      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
        <el-form-item label="项目编号" prop="projectNumber">
          <el-input
            v-model="queryParams.projectNumber"
            placeholder="请输入项目编号"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="项目名称" prop="projectName">
          <el-input
            v-model="queryParams.projectName"
            placeholder="请输入项目名称"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="plainmini" @click="handleQuery">搜索</el-button>
          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
        </el-form-item>
      </el-form>
  
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            type="primary"
            plain
            icon="el-icon-plus"
            size="mini"
            @click="handleAdd"
            v-hasPermi="['bidding:main:add']"
          >新增</el-button>
        </el-col>

        <el-col :span="1.5">
          <el-button
            type="primary"
            plain
            icon="el-icon-plus"
            size="mini"
            @click="handleCeShi"
          >测试</el-button>
        </el-col>

        <el-col :span="1.5">
          <el-button
            type="danger"
            plain
            icon="el-icon-delete"
            size="mini"
            :disabled="multiple"
            @click="handleDelete"
            v-hasPermi="['bidding:main:remove']"
          >删除</el-button>
        </el-col>
        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
      </el-row>
      <div class="balademandList">
        <el-table v-loading="loading" :data="shouYeXran" @selection-change="handleSelectionChange" max-height="434">
          <el-table-column type="selection" width="55" align="center" fixed="left" style="padding-left: 0;"/>
          <el-table-column label="招投标项目编号" align="left" prop="pcmBiddingInviteTenders.projectNumber" width="150" />
          <el-table-column label="项目名称" align="left" prop="pcmBiddingInviteTenders.projectName" width="150"/>
          <el-table-column label="招投标需求编号" align="left" prop="demandNumber" width="150" />
          <el-table-column label="招投标需求明细" align="left">
            <el-table-column label="产品编号" align="left" width="150">
              <template slot-scope="scope">
                <div v-for="(item,index) in scope.row.pcmApplicationDetailList" :key="index">
                  &nbsp;&nbsp;{{ item.pcmMaterialRecord.productNumber }}
                </div>
                <div v-for="num in scope.row.max - scope.row.pcmApplicationDetailList.length" :key="num+10"></div>
              </template>
            </el-table-column>
            <el-table-column label="产品名称" align="left" width="140">
              <template slot-scope="scope">
                <div v-for="(item,index) in scope.row.pcmApplicationDetailList" :key="index">
                  {{ item.pcmMaterialRecord.productName }}
                </div>
                <div v-for="num in scope.row.max - scope.row.pcmApplicationDetailList.length" :key="num+10"></div>
              </template>
            </el-table-column>
            <el-table-column label="单位" align="left">
              <template slot-scope="scope">
                <dict-tag v-for="(item,index) in scope.row.pcmApplicationDetailList" :key="index" :options="dict.type.sys_unit" :value="item.pcmMaterialRecord.unit"/>
                <div v-for="num in scope.row.max - scope.row.pcmApplicationDetailList.length" :key="num+10"></div>
              </template>
            </el-table-column>
            <el-table-column label="需求数量" align="left" prop="item.requiredQuantity">
              <template slot-scope="scope">
                <div v-for="(item,index) in scope.row.pcmApplicationDetailList" :key="index">
                  {{ item.requiredQuantity }}
                </div>
                <div v-for="num in scope.row.max - scope.row.pcmApplicationDetailList.length" :key="num+10"></div>
              </template>
            </el-table-column>
            <el-table-column label="期望到货时间" align="left" prop="item.expectedDeliveryDate" width="150">
              <template slot-scope="scope">
                <div v-for="(item,index) in scope.row.pcmApplicationDetailList" :key="index">
                  {{ item.expectedDeliveryDate }}
                </div>
                <div v-for="num in scope.row.max - scope.row.pcmApplicationDetailList.length" :key="num+10"></div>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column label="供应商资格要求" align="left" width="180">
            <p slot-scope="scope" style="font-size: 13px;margin-top: 0;padding-right: 6px;">
                {{ scope.row.pcmBiddingInviteTenders.supplierQualificationRequirements }}
            </p>
          </el-table-column>
          <el-table-column label="保证金" align="left" prop="pcmBiddingInviteTenders.deposit" width="100"/>
          <el-table-column label="采购负责人" align="left" prop="pcmBiddingInviteTenders.fzr" width="130" />
          <el-table-column label="采购联系电话" align="left" prop="pcmBiddingInviteTenders.procurementContactNumber" width="130" />
          <el-table-column label="报名截止时间" align="left" prop="pcmBiddingInviteTenders.registrationDeadline" width="180"/>
          <el-table-column label="投标开始时间" align="left" prop="pcmBiddingInviteTenders.biddingStartTime" width="180"/>
          <el-table-column label="投标结束时间" align="left" prop="pcmBiddingInviteTenders.biddingEndTime" width="180"/>
          <el-table-column label="评标截止时间" align="left" prop="pcmBiddingInviteTenders.evaluationDeadline" width="180"/>
          <el-table-column label="计划开标时间" align="left" prop="pcmBiddingInviteTenders.plannedBidOpeningTime" width="180"/>
          <el-table-column label="邀请的供应商" align="left" prop="projectCreator" >
            <el-table-column label="供应商名称" align="left" prop="projectCreator" width="150">
              <template slot-scope="scope">
                <div v-for="(item,index) in scope.row.pcmSupplierList" :key="index">
                  {{ item.supplierFullName }}
                </div>
                <div v-for="num in scope.row.max - scope.row.pcmSupplierList.length" :key="num+10"></div>
              </template>
            </el-table-column>
            <el-table-column label="招投标项目编号" align="left" prop="projectCreator" width="150">
              <template slot-scope="scope">
                <div v-for="index in scope.row.pcmSupplierList.length" :key="index">
                  {{ scope.row.demandNumber }}
                </div>
                <div v-for="num in scope.row.max - scope.row.pcmSupplierList.length" :key="num+10"></div>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column label="参与招投标供应商总数" align="left" prop="pcmSupplierList.length" width="100"/>
          <el-table-column label="标书" align="left" width="90">
            <template slot-scope="scope">
              <span v-for="(item,index) in scope.row.pcmPublicAttachmentList" :key="index">
                <el-image style="width: 40px; height: 40px;"  :src="item.attachmentAddress+item.attachmentName" :title="item.attachmentName" fit="cover">
                  <div slot="error" class="image-slot">
                    <img style="width: 30px;height: 36px;" :title="item.attachmentName" src="http://8.130.88.144:9000/xinghai/yiwenhao.png">
                  </div>
                </el-image>
              </span>
            </template>
          </el-table-column>
          <el-table-column label="评标规则" align="left" prop="pcmEvaluationCriteria.criteriaName" width="150"/>
          <el-table-column label="评标规则" align="left" prop="projectStatus" >
            <el-table-column label="评估项" align="left" prop="projectStatus" width="150">
              <template slot-scope="scope">
                <div v-for="(item,index) in scope.row.pcmEvaluationCriteria.pcmEvaluationRuleList" :key="index">
                  {{ item.evaluationItem }}
                </div>
                <div v-for="num in scope.row.max - scope.row.pcmEvaluationCriteria.pcmEvaluationRuleList.length" :key="num+10"></div>
              </template>
            </el-table-column>
            <el-table-column label="评分详情及标准" align="left" prop="projectStatus"  width="300">
              <template slot-scope="scope">
                <div v-for="(item,index) in scope.row.pcmEvaluationCriteria.pcmEvaluationRuleList" :key="index">
                  {{ item.scoreDetailsAndStandards }}
                </div>
                <div v-for="num in scope.row.max - scope.row.pcmEvaluationCriteria.pcmEvaluationRuleList.length" :key="num+10"></div>
              </template>
            </el-table-column>
            <el-table-column label="最高分" align="left" prop="projectStatus" width="100">
              <template slot-scope="scope">
                <div v-for="(item,index) in scope.row.pcmEvaluationCriteria.pcmEvaluationRuleList" :key="index">
                  {{ item.maximumScore }}
                </div>
                <div v-for="num in scope.row.max - scope.row.pcmEvaluationCriteria.pcmEvaluationRuleList.length" :key="num+10"></div>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column label="满分" align="left" prop="sumCriteria" width="100" />
          <el-table-column label="专家明细" align="left">
            <el-table-column label="专家名称" align="left" prop="projectStatus" width="100">
              <template slot-scope="scope">
                <div v-for="(item,index) in scope.row.pcmExpertEvaluationProcessList" :key="index">
                  {{ item.expertName }}
                </div>
                <div v-for="num in scope.row.max - scope.row.pcmExpertEvaluationProcessList.length" :key="num+10"></div>
              </template>
            </el-table-column>
            <el-table-column label="联系电话" align="left" prop="projectStatus" width="150">
              <template slot-scope="scope">
                <div v-for="(item,index) in scope.row.pcmExpertEvaluationProcessList" :key="index">
                  {{ item.expertPhone }}
                </div>
                <div v-for="num in scope.row.max - scope.row.pcmExpertEvaluationProcessList.length" :key="num+10"></div>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column label="提交人" align="left" prop="pcmBiddingInviteTenders.tjr" width="100"/>
          <el-table-column label="提交时间" align="left" prop="pcmBiddingInviteTenders.submissionTime" width="180"/>
          <el-table-column label="更新时间" align="left" prop="pcmBiddingInviteTenders.updateTime" width="180"/>
          <el-table-column label="流程状态" align="left" prop="" width="180">
            <template slot-scope="scope">
              <dict-tag :options="dict.type.pcm_projectstatus" :value="scope.row.pcmBiddingInviteTenders.projectStatus"/>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />
    </div>
  </template>
  
  <script>
  import { getMain, delMain, addMain, updateMain,showAllByMiddleNumberName,ceShi } from "@/api/bidding/Inviting";
  import dict from "@/utils/dict";
  export default {
    name: "Main",
    dicts: [
    "pcm_supplier_states",
    "sys_type_purchase",
    "demand_line_status",
    "sys_unit",
    "sys_sup_cat",
    "pcm_projectstatus",
  ],
    data() {
      return {
        // 遮罩层
        loading: true,
        // 选中数组
        ids: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 招标需求主表格数据
        mainList: [],
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        open: false,
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 5,
          projectNumber: null,
          projectName: null,
        },
        // 表单参数
        form: {},
        // 表单校验
        rules: {
        }
      };
    },
    created() {
      this.getList();
    },
    computed:{
      shouYeXran(){
        return this.mainList.map(item=>{
          let gys = item.pcmSupplierList.length;
          let cp = item.pcmApplicationDetailList.length;
          let gz = item.pcmEvaluationCriteria.pcmEvaluationRuleList.length;
          let zj = item.pcmExpertEvaluationProcessList.length;
          item.max = Math.max(gys,cp,gz,zj);
          item.sumCriteria = item.pcmEvaluationCriteria.pcmEvaluationRuleList.reduce((total, rule) => {
            return total + rule.maximumScore;
          }, 0);
          return item;
        })
      }
    },
    methods: {
      /** 查询招标需求主列表 */
      getList() {
        this.loading = true;
        showAllByMiddleNumberName(this.queryParams).then(response => {
          console.log("response",response);
          this.mainList = response.rows;
          this.total = response.total;
          this.loading = false;
        });
      },
      // 取消按钮
      cancel() {
        this.open = false;
        this.reset();
      },
      // 表单重置
      reset() {
        this.form = {
          projectNumber: null,
          projectName: null
        };
        this.resetForm("form");
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.resetForm("queryForm");
        this.handleQuery();
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        this.ids = selection.map(item => item.projectID)
        this.single = selection.length!==1
        this.multiple = !selection.length
      },
      /** 新增按钮操作 */
      handleAdd() {
        this.$router.push('/bidding/InvitingAdd');
      },


      /** 新增按钮操作 */
      handleCeShi() {
        ceShi().then(response=>console.log(response));
      },
      /** 修改按钮操作 */
      handleUpdate(row) {
        this.reset();
        const projectID = row.projectID || this.ids
        getMain(projectID).then(response => {
          this.form = response.data;
          this.open = true;
          this.title = "修改招标需求主";
        });
      },
      /** 提交按钮 */
      submitForm() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            if (this.form.projectID != null) {
              updateMain(this.form).then(response => {
                this.$modal.msgSuccess("修改成功");
                this.open = false;
                this.getList();
              });
            } else {
              addMain(this.form).then(response => {
                this.$modal.msgSuccess("新增成功");
                this.open = false;
                this.getList();
              });
            }
          }
        });
      },
      /** 删除按钮操作 */
      handleDelete(row) {
        const projectIDs = row.projectID || this.ids;
        this.$modal.confirm('是否确认删除招标需求主编号为"' + projectIDs + '"的数据项？').then(function() {
          return delMain(projectIDs);
        }).then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        }).catch(() => {});
      },
      /** 导出按钮操作 */
      handleExport() {
        this.download('bidding/main/export', {
          ...this.queryParams
        }, `main_${new Date().getTime()}.xlsx`)
      }
    }
  };
  </script>

<style scoped>
  ::v-deep .el-table .el-table__fixed-header-wrapper th{
    height: 36px;
  }
  ::v-deep .el-table .el-table__header-wrapper th{
      height: 36px;
  }
  ::v-deep .balademandList .cell div {
    padding: 2px 0;
    border-bottom: 1px solid #dfe6ec;
    height: 30px;
    margin-left: -10px;
    padding-left: 10px;
  }
  ::v-deep .cell div:nth-last-child(1) {
    border-bottom: 0px;
  }
  ::v-deep .cell {
    padding: 0px;
    font-size: 14px;
    padding-left: 10px;
    font-family: -apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;
  }
  ::v-deep .cell>span:nth-child(even) {
    padding-left: 6px;
  }
  ::v-deep .el-table--medium .el-table__cell{
    padding: 6px 0 0 0;
  }
  ::v-deep .el-table .el-table__cell{
    padding: 6px 0 0 0;
  }
  ::v-deep .el-table--enable-row-transition .el-table__body td.el-table__cell{
    vertical-align: top;
  }
  ::v-deep .el-table th.el-table__cell > .cell{
    font-size: 13px;
    padding-right:0;
  }
  ::v-deep .el-checkbox{
    margin-left: -10px;
  }
</style>